CloudFront で S3 静的ウェブサイトホスティングを SSL/TLS に対応させる

こんにちは、菊池です。

先日、以下のエントリでS3を静的ウェブサイトとして公開する手順を紹介しました。

S3 静的ウェブサイトホスティングのドメインを別のAWSアカウントで管理する

今回は、このウェブサイトをSSL/TLSに対応させ、HTTPSでアクセス可能な環境にする手順を紹介します。前提として、上記の記事の手順でS3が公開されていることを前提とします。

S3 + CloudFrontで静的コンテンツをHTTPSで公開するのは、以下でも紹介の通り鉄板の構成です。

• AWSにおける静的コンテンツ配信パターンカタログ（アンチパターン含む）

現時点で最新の手順と共に紹介します。

SSL/TLS対応手順

大まかな手順は以下の通りです。

• AWS Certificate Manager（ACM）で証明書の取得
• CloudFrontディストリビューションの作成
• Route 53レコードを変更しアクセス先の変更

AWS Certificate Manager（ACM）で証明書の取得

まずは証明書の取得です。注意点は、CloudFrontで利用するためにバージニアリージョン（us-east-1）で取得することです。

利用するドメイン名を入力し、次に進みます。

証明書ドメインの検証方法を選択します。今回は、Route 53で取得済みのドメインを利用しますので、DNS検証を選択しました。

作成すると、検証保留中のステータスとなりますので、DNS設定の内容をダウンロードします。

ダウンロードしたファイルから、DNSに設定すべきレコードと、CNAMEの値を確認します。この値を、Route 53のレコードに登録します。

問題なければ、数分で検証が行われ、ACMの証明書が利用可能になります。

CloudFrontディストリビューションの作成

続いて、CLoudFrontnの設定です。Webディストリビューションの作成に進みます。

[Origin Domain Name]に、アクセス先となるS3のバケットを選択します。[Origin ID]には自動で値が入ります。

Default Cache Behavior Settingでは、[Viewer Protocol Policy]をRedirect HTTP to HTTPSに設定します。これにより、HTTPでアクセスした際には自動でHTTPSにリダイレクトされます。

Distribution Settingsでは、[Alternate Domain Names [CNAMEs]]に、アクセスさせるドメイン名を入力します。[SSL Certificate]に、Custom SSL Certificateを選択して、先ほど作成したACM証明書を選択します。

[Default Root Object]には、index.htmlを入力します。これは、ドメイン名のみのルートURL（例：https:example.com）でリクエストした際に返すドキュメントを指します（参考）。

以上を設定し、ディストリビューションが作成されるのを待ちます。

Route 53レコードの変更

ディストリビューションが作成されたら、ディストリビューションのドメイン名（dxxxxxxxxxxx.cloudfront.net）を確認します。

利用するドメインへのアクセスをこのディストリビューションに切り替えるため、Route 53を設定します。

すでにS3を公開している場合には、そのドメインのレコードを選択し、Aliasレコードを、CloudFrontディストリビューションのドメイン名（dxxxxxxxxxxx.cloudfront.net）に指定して更新します。

最後に、ブラウザでアクセスして確認します。HTTPSでアクセスできることが確認できました！

まとめ

以上です。

CloudFront経由でのアクセスであれば、S3の静的ウェブサイトホスティングは無効化して問題ありません。なお、今回の手順では、CloudFrontの設定は必要最小限のみ行い、キャッシュの設定などはデフォルトとなります。必要に応じ、配信するコンテンツに合わせた設定をしましょう。